import React, { Component } from 'react'
// import store from '../store'
import { connect } from 'react-redux'

import { add, minus, asyncMinus, asyncSetName } from '../store/actionCreator'
// import Brother2 from './Brother2'
class Brother1 extends Component {
    state = {
        name: ''
    }
    add1 = () => {
        this.props.addNum(3)
    }
    minus1 = () => {
        this.props.minusNum(2)
    }
    sure = () => {
        this.props.setName(this.state.name)
    }
    render() {
        return (
            <div>
                <h2>brother1</h2>
                <br />
                <button onClick={this.add1}>加+</button>&nbsp;&nbsp;&nbsp;
                <button onClick={this.minus1}>减-</button>
                <br />
                <br />
                <br />
                <input type="text" value={this.state.name}
                    onChange={e => this.setState({ name: e.target.value })} />&nbsp;&nbsp;&nbsp;
                <button onClick={this.sure}>确定</button>
            </div>
        )
    }
}
const mapDispatchToProps = dispatch => {
    // 这个返回的对象是作为 Brother1的 props
    return {
        addNum: function (num) {
            dispatch(add(num))
        },
        minusNum(num) {
            dispatch(asyncMinus(num))
        },
        setName(name) {
            dispatch(asyncSetName(name))
        }
    }
}
export default connect(null, mapDispatchToProps)(Brother1)
